<template>
  <div id="container"></div>
</template>

<script setup>
import { onBeforeUnmount } from 'vue';
import * as turf from '@turf/turf';
import initMap from '@/utils/initMap';
import Vehicle, { vehicleInsList } from '@/utils/vehicle.js';
import Coordtransform from '@/utils/coordtransform';

// initMap().then(() => {
//   connectSocket();
// });

// let curId = '01XY00a1';
// let timer: number | null | undefined = null;
// let socket: WebSocket;

// const connectSocket = () => {
//   socket = new WebSocket('ws://113.13.185.219:8090/ws');
//   socket.onopen = () => {
//     const params = JSON.stringify({
//       type: [2],
//       isAll: 'true',
//       directType: '0',
//     });
//     heartbeat();
//     socket.send(params);
//   };
//   socket.onmessage = (e) => {
//     if (e.data) {
//       const data = JSON.parse(e.data)?.result || {};
//       if (data.devid === curId) {
//         data.coordinates = Coordtransform.wgs84togcj02(
//           data.longitude,
//           data.latitude
//         );
//         if (!vehicleInsList[curId]) {
//           vehicleInsList[curId] = new Vehicle(data);
//         } else if (data.speed) {
//           vehicleInsList[curId].push(data);
//         }
//       }
//     }
//   };
//   const heartbeat = () => {
//     timer = setInterval(() => {
//       const params = JSON.stringify({ type: [9] });
//       socket.send(params);
//     }, 10000);
//   };
// };

// onBeforeUnmount(() => {
//   socket.close();
//   timer && clearInterval(timer);
// });
</script>

<style lang="scss">
#container {
  width: 80vw;
  height: 80vh;
}
</style>
